import React, { Component } from 'react';
import { connect } from 'react-redux';
import { TopicWrapper, TopicIter } from '../style'

class Topic extends Component {
  
  render() {
    const { list } = this.props;
    return (
      <TopicWrapper>
        {list && list.toJS().map(v => (
              <TopicIter key={v.id}>
                <img className="topic-pic" alt="" src={v.imgUrl} />
                {v.title}
              </TopicIter>
          ))}
      </TopicWrapper>
    )
  }
}

const mapState = state => ({
  list: state.getIn(['home','topicList'])
})
export default connect(mapState,null)(Topic);